<!DOCTYPE html>
<html>
  <head>
    <title>Test 4.1 for role menubar</title>
    <link rel='stylesheet' href='../css/aria_tests.css' type='text/css' media='all'>
    <script src='../js/aria_constants.js' type='text/javascript'></script>
    <link rel='stylesheet' href='../css/aria_menubar.css' type='text/css' media='all'>
    <script src='../js/jquery.js'            type='text/javascript'></script>
    <script src='../js/aria_tests.js'        type='text/javascript'></script>
    <script src='../js/show_test_results.js' type='text/javascript'></script>
    <script src='results_menubar_004_001.js' type='text/javascript'></script>
    <script src='../js/aria_menubar.js' type='text/javascript'></script>
    <script type='text/javascript'>
      function setFocus() { 
        node = document.getElementById('mi2');
        node.focus();
      } // end onload function 
    </script>
  </head>
  <body id='test_004_001' onload='setFocus()'>
    <div class='nav'>
      <ul role='navigation' aria-label='menuitem test navigation'>
        <li><a href='../index.html'>All Tests</a></li>
        <li><a href='index.html'>menuitem Tests</a></li>
      </ul>
    </div>
    <h1>Test 4.1 for role menubar</h1>
    <p>Test ID: test_004_001</p>
    <p class='description'><strong>Description: </strong>Simple menubar, no popups</p>
      <ul id='test1' role='menubar'
          aria-label='Menubar aria label content'
      >
        <li id='mi1' role='menuitem'  tabindex='0'>Menu Item 1</li>
        <li id='mi2' role='menuitem'  tabindex='0'>Menu Item 2</li>
        <li id='mi3' role='menuitem'  tabindex='0'>Menu Item 3</li>
        <li id='mi4' role='menuitem'  tabindex='0'>Menu Item 4</li>
    </ul>
      <h2>Accessible Name</h2>
        <p><a href='http://www.w3.org/TR/wai-aria/roles#namecalculation'>Information on accessible name calculation</a>.</p>
        <p class='name'><strong>Calculated Accesible Name: </strong><span>Menubar aria label content </span></p>
        <table class='name' border='1px' summary='Sources of Accessible Name for Widget'>
          <caption>Sources of Accessible Name for Widget</caption>
          <thead>
            <tr>
              <th>Source</th>
              <th>Value</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <th>aria-label attribute</th>
              <td>Menubar aria label content</td>
            </tr>
          </tbody>
        </table>
    <h2>Accessibility API Mappings</h2>
    <table class='api' border='1px' summary='Accessibility API Mappings'>
      <caption>Accessibility API Mappings</caption>
      <thead>
        <th>Value</th>
        <th>MSAA</th>
        <th>IAccessible2</th>
        <th>UIA</th>
        <th>ATK</th>
        <th>MAC</th>
      </thead>
      <tbody>
        <tr>
          <th>
            Role=menuitem
          </th>
          <td>
            <ul>
            <li>ROLE_SYSTEM_MENUITEM
            </ul>
          </td>
          <td>
            <ul>
            <li>none
            </ul>
          </td>
          <td>
            <ul>
            <li>MenuItem
            </ul>
          </td>
          <td>
            <ul>
            <li>ATK_ROLE_MENU_ITEM
            <li>If aria-checked (state) is not undefined, support object attribute checkable='true'
            </ul>
          </td>
          <td>
            <ul>
            <li>If the option's parent has a group role, then role='menuitem' maps to NSAccessibilityMenuButtonRole
            <li>If the option's parent has a menu role, then role='menuitem' maps to NSAccessibilityMenuItemRole
            <li>AXMenuItem
            </ul>
          </td>
        </tr>
      </tbody>
    </table>
  </body>
</html>
